<template>
  <section id="ljjs" :loading="btnloading">
      <p style='padding: 7px;background: #f5f7fa1f;text-align: center;'>请2小时内支付</p>
      <div style="background-color: white;padding-left:15px;padding-right:15px;">
        <br><br>
        <p>
          <span>付款商户</span>
          <span style='font-weight:600;'>{{orderInfo.fullName}}</span>
        </p>
        <p style='margin:15px 0'>
          <span>服务类型</span>
          <span style='font-weight:600;'>{{orderInfo.serviceName}}</span>
        </p>
        <div>合计&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="font-size:30px;">￥{{orderInfo.realAmount}}</span></div>
        <br><br>
      </div>
    <div style="text-align:center;">
      <br><br>
      <el-button  class="submitbtn"  @click="submitorder">提交</el-button>
    </div>
  </section>
</template>
<script>
import { URL_PAY,URL_USER_ORDREINFO ,_layer,HREF} from "@/comm.js";
export default {
  data: function() {
    return {
      btnloading: false,
      orderInfo:{},
    };
  },
  beforeCreate: function() {
    $("title").text("立即结算");
  },
  created(){
    let This=this;
    let send={
      orderNum:this.$route.query.num
    };
    $.post(URL_USER_ORDREINFO,send,function(data){
      if(data.retult){
        This.orderInfo=data.data;
      }else{
        _layer('支付数据有误');
      }
    });
  },
  mounted: function() {
    setTimeout(function() {
      let h = $(window).height();
      $("#ljjs").css("min-height", h + "px");
    }, 500);
  },
  methods: {
    pay(json){
      WeixinJSBridge.invoke('getBrandWCPayRequest', json.pay, function(res){  
         if(res.err_msg == "get_brand_wcpay_request:ok" ) {
            console.log('支付成功');
            _layer("订单支付成功");
            setTimeout(function(){
              window.location.href=HREF+'/my-order.html';
            },1500);
         }else{
            _layer('噢，支付失败');
         }  
      }); 
    },
    //提交
    submitorder(){
      let This=this;
      this.btnloading=true;
      let send={
        orderNum:this.$route.query.num
      };
      $.post(URL_PAY,send,function(data){
        console.log('支付返回');
        console.log(data);
        if(data.retult){
          if (typeof WeixinJSBridge == "undefined"){
             _layer('请用微信支付');
          }else{
             This.pay(data.data);
          }
        }else{
          _layer('支付失败');
        }
      });
    }, 
  }
};
</script> 
<style>
#ljjs .submitbtn {
  border-radius: 8px;
  height: 40px;
  background-color: #333333;
  width: 80%;
  color: #d9c882;
  border: 0px;
  font-size: 18px;
}
</style>
